<template>
  <div id="app">
    <router-view />
  </div>
</template>

<script>
import { mapState, mapActions } from 'vuex'
// import { handleScreenHeightToVh } from '@/utils/tools'
import { WEB_MSG_ORDER_ENUM, TOPIC_ENUM } from '@/utils/ws-mqtt'

const noMessageShowPathList = ['/login']

export default {
  name: 'App',
  computed: {
    ...mapState({
      mqttClient: state => state.mqttws.mqttClient,
    }),
  },
  async mounted() {
    if (!this.mqttClient) {
      await this.initMqttClient()
    }

    this.mqttClient.subscribe('web_msg')
    this.mqttClient.getMessage(
      TOPIC_ENUM.WEB_MSG,
      WEB_MSG_ORDER_ENUM.DEVICE_ALERT,
      ({ topic, data }) => {
        if (noMessageShowPathList.includes(this.$route.path)) {
          return
        }
        // 隐藏消息提醒
        // this.$notify({
        //   title: data.msgTitle,
        //   message: `【${data.deviceName}】发生【${data.msgContent}】事件`,
        //   offset: handleScreenHeightToVh(68),
        //   duration: 3000,
        //   customClass: 'custom-notification',
        // })
      }
    )
  },
  methods: {
    ...mapActions('mqttws', ['initMqttClient']),
  },
}
</script>

<style>
/* @import url('https://fonts.googleapis.com/css?family=Noto+Sans+SC:100,300,400,500,700,900'); */

#app {
  min-width: 1080px;
  font-family: Noto Sans SC;
  font-style: normal;
}
</style>




